<template>
  <a-modal :open="open" width="950px" title="催款单" centered :footer="false" @cancel="onCancel">
    <div class="flex">
      <div class="w-1/2 pr-2">
        <a-input v-model:value="formState.brName" disabled />
        <UserCard :user-data="formState" class="mt-3 mb-2" :show-br-id="false">
          <div class="flex flex-col justify-between px-5">
            <div class="mt-6">
              <LabelValue label-align="right" label-class="font-semibold" :label-width="120" label="住院号" :value="formState.admissionCode" />
            </div>
            <div class="mt-6">
              <LabelValue label-align="right" label-class="font-semibold" :label-width="120" label="病区" :value="formState.wardName" />
            </div>
            <div class="mt-6">
              <LabelValue label-align="right" label-class="font-semibold" :label-width="120" label="科室" :value="formState.ksmc" />
            </div>
            <div class="mt-6 mb-4">
              <LabelValue label-align="right" label-class="font-semibold" :label-width="120" :width="200" label="入院时间" :value="formState.admissionTime" />
            </div>
            <a-descriptions />
          </div>
        </UserCard>
        <a-popover title="" trigger="hover">
          <template #content>
            <div class="px-2 py-2">
              <p v-for="(item, index) in recordData" :key="index" class="mb-1">
                <span>{{ item.DunningTime || '-' }}</span>
                <span class="ml-2">催款 ￥{{ formatAmount(item.amount) || '-' }}</span>
                <span class="ml-2">流水号：{{ item.id || '-' }}</span>
              </p>
            </div>
          </template>
          <span class="text-primary cursor-pointer text-sm mb-0">催款记录</span>
        </a-popover>
      </div>
      <div class="w-1/2 h-[320px]">
        <a-form :model="formState" class="form-style-flex">
          <a-form-item label="催款金额" v-bind="validateInfos.amount" class="w-full">
            <a-input v-model:value="formState.amount" v-input:float.2 placeholder="0.00" class="text-right">
              <template #prefix> <span class="text-gray-400">￥</span> </template>
            </a-input>
          </a-form-item>
          <a-form-item label=" " class="w-full mb-2 -mt-3">
            <p class="mb-0 text-gray-500">
              <span>住院费用：￥{{ formatAmount(formState.settlementAmount) }}</span>
              <span class="ml-4">已收预收款：￥{{ formatAmount(formState.deJeCount) }}</span>
            </p>
          </a-form-item>
          <a-form-item label="备注" class="w-full">
            <a-textarea v-model:value="formState.memo" :rows="10" placeholder="请输入" />
          </a-form-item>
        </a-form>
      </div>
    </div>
    <div class="mt-2 flex justify-end">
      <a-button @click="onClickReset">重置</a-button>
      <a-button type="primary" class="ml-4" @click="onOk">确定</a-button>
    </div>
    <!-- <ChargeModal v-model:open="chargeOpen" :charge-title="chargeTitle" :business-data="{ ysje: formState.dpJe }" @success="onSuccessPrice" /> -->
  </a-modal>
</template>
<script setup>
import { ref, watch } from 'vue'
import { message } from 'ant-design-vue'
import { post } from '@/utils/request'
import UserCard from '@/components/UserCard'
import { formatAmount } from '@/utils/format.js'

const emit = defineEmits(['update:open', 'success'])
const props = defineProps({
  open: {
    type: Boolean,
    default: false
  },
  patientInfo: {
    type: Object,
    default: () => ({})
  },
  placeholderInfo: {
    type: String,
    default: '姓名/助记码/卡号/手机号/证件号码'
  },
  selectNameDisabled: {
    type: Boolean,
    default: false
  },
  chargeTitle: {
    type: String,
    default: ''
  },
  searchParams: {
    type: Object,
    default: () => ({})
  },
  // 0 点击重置，不清空人名 1 点击重置，清空表单所有值
  depositType: {
    type: Number,
    default: 1
  }
})
const formState = ref({ amount: '' })
const rulesState = ref({
  amount: [{ required: true, message: '请输入催款金额' }]
})
const recordData = ref([])
const { resetFields, validateInfos } = useForm(formState, rulesState)

const onClickReset = () => {
  formState.value.amount = ''
  formState.value.memo = ''
}
const onOk = async () => {
  if (!formState.value.brName) return message.error('姓名不能为空')
  if (!formState.value.amount) return message.error('催款金额不能为空')
  if (formState.value.amount === '0') return message.error('催款金额需大于0')
  const { code, msg } = await post('inp/inpComprehensive/doSaveChargeStandard', {
    admissionCode: formState.value.admissionCode,
    amount: formState.value.amount,
    brId: formState.value.brId,
    memo: formState.value.memo
  })
  if (code !== 0) return message.error(msg)
  message.success(msg || '催款成功')
  onPrint()
  emit('success')
  onCancel()
}
const getRecordData = async () => {
  const { code, msg, data } = await post('/inp/inpComprehensive/getChargeReminderEntityList', {
    admissionCode: formState.value.admissionCode,
    brId: formState.value.brId
  })
  if (code !== 0) return message.error(msg || '获取催款记录失败')
  recordData.value = data || []
}

const onCancel = () => {
  emit('update:open', false)
  resetFields()
}
const onPrint = async () => {
  const { code, msg, data } = await post('/inp/Print/inpDemandNotePrint', {
    ckje: formState.value.amount,
    inplsh: formState.value.inplsh,
    yjkje: formState.value.zhye,
    cmemo: formState.value.memo
  })
  if (code !== 0) return message.error(msg)
  window.openExe?.rpt(data) //调用winform打印
}

watch(
  () => props.open,
  (val) => {
    if (val) {
      onClickReset()
      formState.value = props.patientInfo
      getRecordData()
    }
  },
  { immediate: true }
)
</script>

<style lang="less" scoped>
.ant-tag-checkable-checked {
  color: #fff;
  background-color: var(--primary-color);
}
</style>
